{% extends "base/base.html" %}
{% block content %}

<script type="text/javascript">

   // Date Pickers and Submit
   $(function() {

      //Date
      $("#date").datepicker({dateFormat: 'yy-mm-dd'});

      //Time
      $("#time").timepicker({timeSeparator: ':'});

   });

</script>

<form method="POST" name="create" id="report" action="/create">
   {% csrf_token %}

<table class="top">

 <tr>
  <td colspan="5">
   <p class="title">New Incident</p>
  </td>
 </tr>

 <tr>
  <td colspan="5" align="left">
   <div class="help" id="help">
    When submitting a new incident, the following guidelines should be followed:
    <li>A description must be provided
    <li>A date and time must be provided (use the date the incident began)
    <li>At least one service must be selected
    <li>To broadcast a message about the incident, select the "Broadcast Email" checkbox.
   </div>
  </td>
 </tr>

 <tr>
  <td colspan="5" height="25"><hr></td>
 </tr>

 <tr>
  <td style="text-align:center;"><b>Description</b></td>
  <td width="25"></td>
  <td style="text-align:center;"><b>Affected Services</b></td>
  <td width="25"></td>
  <td style="text-align:center;"><b>Options</b></td>
 </tr>

 <tr>
  <td colspan="5" height="20"></td>
 </tr>

 <tr>
  <td>
   <textarea class="textarea_detail" id="detail" name="detail" rows="25" cols="50">{% if not form.detail.data == None %}{{form.detail.data}}{% endif %}</textarea>
  </td>
  <td></td>
  <td valign="top">
   <table>
    {% for row in services %}
    <tr>
     <td><input type="checkbox" name="service" value="{{row.id}}"/></td>
     <td>{{row.service_name}}</td>
    </tr>
    {% endfor %}
   </table>
  </td>
  <td></td>
  <td valign="top">
   <table>
    <tr>
     <td align="right"><input type="checkbox" name="email" checked/></td>
     <td>Broadcast Email</td>
    </tr>
    <tr>
     <td colspan="2" height="5"></td>
    </tr>
    <tr>
     <td>Date</td>
     <td><input type="text" class="input_date" name="date" id="date" value="{% if form.date.data %}{{form.date.data}}{% else %}{% if time_now %}{{time_now|date:"Y-m-d"}}{% endif %}{% endif %}"/></td>
    </tr>
    <tr>
     <td>Time</td>
     <td><input type="text" class="input_date" name="time" id="time" value="{% if form.time.data %}{{form.time.data}}{% else %}{% if time_now %}{{time_now|date:"H:i"}}{% endif %}{% endif %}"/></td>
    </tr>
    <tr>
     <td colspan="2" style="text-align:right;"><input type="submit" value="submit"/></td>
    </tr>
   </table>
  </td>
 </tr>

 <tr>
  <td colspan="5">* All times are in {{TIME_ZONE}}</td>
 </tr>

 <tr>
  <td colspan="5">
   <p class="error">
     {% if form.date.errors %}
      <br>{% for error in form.date.errors %}{{error}}{% endfor %}
     {% endif %}
     {% if form.time.errors %}
      <br>{% for error in form.time.errors %}{{error}}{% endfor %}
     {% endif %}
     {% if form.detail.errors %}
      <br>{% for error in form.detail.errors %}{{error}}{% endfor %}
     {% endif %}
     {% if form.service.errors %}
      <br>{% for error in form.service.errors %}{{error}}{% endfor %}
     {% endif %}
   </p>
  </td>
 </tr>

</table>
</form>

{% endblock %}



